import React,{Component} from "react";
import PropTypes from "prop-types"
import {Form,Input,Select} from "antd"
const Item = Form.Item
const Option = Select.Option
// 添加分类的Form组件
 class AddForm extends Component{

    // 声明接收
    static propTypes = {
        // 一级分类的数组
        categoryList:PropTypes.array.isRequired,
        // 接收parentId为了显示二级分类列表的父分类
        parentId:PropTypes.string.isRequired,
        // 用来传递form函数
        setForm:PropTypes.func.isRequired
    }

    componentWillMount() {
        this.props.setForm(this.props.form)
    }


     render() {
        // 为了校验
        const {getFieldDecorator} = this.props.form
        const {categoryList,parentId} = this.props

        return(
           <Form>
               <Item>
                   {
                       // 收集指定的分类Id
                       getFieldDecorator('parentId',{
                           initialValue:parentId
                       })(
                           <Select>
                               <Option value="0">一级分类</Option>
                               {
                                  categoryList.map(item=> <Option value={item._id}>{item.name}</Option>)
                               }
                           </Select>
                       )
                   }

               </Item>
               <Item>
                   {
                       // 收集指定的分类名称
                       getFieldDecorator('categoryName',{
                           initialValue:'', // 默认不输入分类名称
                           rules:[
                               {required:true,message:'分类名称必须输入'}
                           ]
                       })(
                           <Input placeholder="请输入分类名称"/>
                       )
                   }

               </Item>
           </Form>
        )
    }
}
// 为了拿到Form对象
export default Form.create()(AddForm)
